<template>
	<u-sticky offset-top="0" h5-nav-height="0">
		<immerse :backgroundColor="backgroundColor"></immerse>
		<!-- 顶部兼容组件APP端-结束 -->
		<view class="hone">
			<image class="hlogo" mode="widthFix" :src="configinfo.logo?configinfo.logo:'/static/img/nlogo.png'" @click="gethome" />
			<view class="leiview" @click="fabu" v-if="lei == 2">
				<image class="icon_fb" src="/static/img/icon_fb.png"/>
				<text class="fabu">发布名片</text>
			</view>
			<view class="leiview" @click="fabutwo" v-else-if="lei == 3">
				<image class="icon_fb" src="/static/img/icon_fb.png"/>
				<text class="fabu">发布项目</text>
			</view>
			<view class="rhview ml" v-else>
				<image class="icon_ss" src="/static/img/icon_ss.png"/>
				<u-input v-model="keyword" type="text" :border="false" placeholder="请输入关键词搜索"/>
				<text class="soutit" @click="getsou">搜索</text>
			</view>
		</view>
	</u-sticky>
</template>

<script>
export default {
	props: {
		shaishow: {
			type: Boolean,
			default: false
		},
		lei:{
			type: String,
			default: ''
		},
		keywords:{
			type: String,
			default: ''
		},
		backgroundColor:{
			type: String,
			default:'#fff'
		}
	
	},
	name: "Nheader",
	data() {
		return {
			ispayPop: true,
			animat: this.isanimate(),
			keyword:this.keywords,
			configinfo:uni.getStorageSync('configinfo')
		};
	},
	created(){
		console.log("加载")
		this.getconfig();//公共配置
	},
	methods: {
		// getsou(){
		// 	uni.showToast({
		// 		title: '点击此处',
		// 		icon: 'success'
		// 	})
		// },
		async getconfig() {
			let res = await this.$u.api.configinit({
			});
			uni.setStorageSync('configinfo', res)
			this.configinfo  = res
			// console.log(uni.getStorageSync('configinfo'))
		},
		getsou() {
			this.$emit("getsou",this.keyword);
		},
		connectWallet(){
			
			this.$emit("connectWallet");
		},
		gettantwo(){
			this.$emit("gettantwo");
		},
		getmine(){
			this.$emit("getmine");
		},
		gethome(){
			uni.switchTab({ url: '/pages/tabbar/Tabhome' })
		},
		getfen(){
			this.navrouter("/pages/TPage/DayMore");
		},
		fabu(){
			this.navrouter("/pages_subject/twoPage/FabuMP");
		},
		fabutwo(){
			this.navrouter("/pages_subject/twoPage/FabuRW");
		}
	}
}
</script>

<style scoped lang="scss">
.hone {
	// background: #FFFFFF;
	background: #d6edff;
	// height: 96rpx;
	// box-shadow: 0rpx 10rpx 20rpx 0rpx rgba(202,205,217,0.14);
	opacity: 1;
	display: flex;
	flex-direction: row;
	align-items: center;
	padding: 20rpx 30rpx;
	position: relative;
	z-index: 10;
	.hlogo{
		width: 160rpx;
		height: 68rpx;
	}
	.ml{
		margin-left: auto;
	}
	.gricon{
		width: 50rpx;
		height: 50rpx;
	}
	.rhview{
		display: flex;
		flex-direction: row;
		align-items: center;
		height: 90rpx;
		padding: 0 20rpx;
		// background: #F3F4F6;
		background: #fff;
		border-radius: 16rpx;
		flex: 1;
		margin-left: 20rpx;
		.icon_ss{
			width: 40rpx;
			height: 40rpx;
			margin-right: 18rpx;
		}
	}
	.mltwo{
		margin-left: 20rpx;

	}
	.appdown{
		padding: 8rpx 16rpx;
		border-radius: 50rpx;
		border: 1px solid #FA4E4E;
		font-weight: 400;
		font-size: 24rpx;
		color: #FA4E4E;
	}
	.hrview{
		margin-left: auto;
		display: flex;
		flex-direction: row;
		align-items: center;
		.souicon{
			width: 40rpx;
			height: 40rpx;
			margin-left: 60rpx;
		}
		.geng{
			width: 38rpx;
			height: 36rpx;
			margin-left: 60rpx;
		}
	}
	.leiview{
		padding: 10rpx 20rpx;
		background: linear-gradient(-41deg, #4CB7F0, #198AFE);
		border-radius: 25rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-left: auto;
		.icon_fb{
			width: 32rpx;
			height: 32rpx;
			margin-right: 4rpx;
		}
		.fabu{
			font-family: PingFang SC;
			font-weight: 500;
			font-size: 24rpx;
			color: #FEFEF8;
		}
	}

}
.fenview{
	width: 48rpx;
	height: 48rpx;
	background: linear-gradient(222deg, #E78100, #FEE077);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.soutit{
	font-family: PingFang SC;
	font-weight: 500;
	font-size: 26rpx;
	color: #2291FC;
	display: inline-block;
	margin-left: 20rpx;
}
</style>
